<template>
  <div style="padding: 10px">
    <ElAlert style="margin-bottom: 10px" type="success">{{ message }}</ElAlert>
    <ElInput v-model="name" style="margin-bottom: 10px" />
    <ElButton style="margin-bottom: 10px" type="primary" plain @click="close">取消</ElButton>
    <ElButton style="margin-bottom: 10px" type="primary" plain @click="visible = true">嵌套对话框</ElButton>
  </div>
</template>

<script>
  import { NOOP } from '@web-utils/core'
  import { Alert } from 'element-ui'

  export default {
    name: 'TestComp',
    components: {
      ElAlert: Alert
    },
    inject: {
      close: {
        type: Function,
        default: NOOP
      }
    },
    props: {
      message: String
    },
    data() {
      return {
        name: 'GG',
        visible: false
      }
    },
    created() {
      this.$notify({ type: 'success', title: 'TestComp', message: 'created' })
    },
    methods: {
      onConfirm(done) {
        this.$emit('confirm', { age: 18, name: this.name })
        done && done()
      }
    }
  }
</script>
